<!DOCTYPE html>
<html>
<head>
<style>
#tableDiv {
    display: table;
}
</style>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
</head>
<body>
<div id="tableDiv" contenteditable="true"></div>
<div id="log"></div>
<script>
function runTest(caretPosition, deleteCommand, expectedString)
{
    var testDiv = document.getElementById('tableDiv');
    testDiv.innerText = 'ABCD';

    var selection = window.getSelection();
    selection.collapse(testDiv, caretPosition);

    document.execCommand(deleteCommand);
    assert_equals(document.getElementById('tableDiv').textContent, expectedString);
}

test(function () {
    runTest(0, "forwardDelete", "BCD");
}, "This test verifies that ForwardDelete command is able to successfully delete the first character of a contenteditable div with display: table.");

test(function () {
    runTest(1, "Delete", "ABC");
}, "This test verifies that Delete command is able to successfully delete the last character of a contenteditable div with display: table.");
</script>
</body>
</html>
